<!--<style type="text/css">-->
    <!--.demo-upload-list {-->
        <!--display: inline-block;-->
        <!--width: 60px;-->
        <!--height: 60px;-->
        <!--text-align: center;-->
        <!--line-height: 60px;-->
        <!--border: 1px solid transparent;-->
        <!--border-radius: 4px;-->
        <!--overflow: hidden;-->
        <!--background: #fff;-->
        <!--position: relative;-->
        <!--box-shadow: 0 1px 1px rgba(0, 0, 0, .2);-->
        <!--margin-right: 4px;-->
    <!--}-->

    <!--.demo-upload-list img {-->
        <!--width: 100%;-->
        <!--height: 100%;-->
    <!--}-->

    <!--.demo-upload-list-cover {-->
        <!--display: none;-->
        <!--position: absolute;-->
        <!--top: 0;-->
        <!--bottom: 0;-->
        <!--left: 0;-->
        <!--right: 0;-->
        <!--background: rgba(0, 0, 0, .6);-->
    <!--}-->

    <!--api-->
    <!--.demo-upload-list:hover .demo-upload-list-cover {-->
        <!--display: block;-->
    <!--}-->

    <!--.demo-upload-list-cover i {-->
        <!--color: #fff;-->
        <!--font-size: 20px;-->
        <!--cursor: pointer;-->
        <!--margin: 0 2px;-->
    <!--}-->

    <!--.selected-search {-->
        <!--box-shadow: 0 1px 6px rgba(0, 0, 0, .2);-->
        <!--height: 200px;-->
        <!--width: 260px;-->
        <!--position: relative;-->
        <!--border-radius: 4px;-->
    <!--}-->

    <!--.selected-search .search-action {-->
        <!--position: absolute;-->
        <!--top: 10px;-->
        <!--left: 10px;-->
        <!--right: 10px;-->
    <!--}-->

    <!--.selected-search .selected-arr {-->
        <!--position: absolute;-->
        <!--top: 50px;-->
        <!--left: 20px;-->
        <!--right: 20px;-->
        <!--bottom: 10px;-->
        <!--overflow: scroll;-->
    <!--}-->

    <!--.select-click {-->
        <!--border: 1px solid #dddee1;-->
        <!--border-radius: 4px;-->
        <!--padding: 0 10px;-->
        <!--margin-bottom: 10px;-->
    <!--}-->

    <!--.selected-search .selected-arr .selected-item {-->
        <!--/*border-bottom: 1px solid #dfdfdf;*/-->
    <!--}-->
<!--</style>-->
<!--<template>-->
    <!--<i-form ref="formValidate" :model="formValidate" :rules="ruleValidate" :label-width="80">-->
        <!--<Form-item label="编队名称" prop="title">-->
            <!--<i-input v-model="formValidate.title" placeholder="请输入编队名称"></i-input>-->
        <!--</Form-item>-->
        <!--<Form-item label="标配人数" prop="stablepeoplecount">-->
            <!--<i-input v-model="formValidate.stablepeoplecount" placeholder="请输入标配人数"></i-input>-->
        <!--</Form-item>-->
        <!--<Form-item>-->
            <!--<i-button @click="handleSubmit('formValidate')" type="primary">提交</i-button>-->
            <!--<i-button type="ghost" style="margin-left: 8px">取消</i-button>-->
        <!--</Form-item>-->
    <!--</i-form>-->

<!--</template>-->
<!--<script>-->
    <!--import apiUtil from '../../assets/utils/api_util';-->

    <!--export default {-->
        <!--data() {-->
            <!--return {-->
                <!--formValidate: {-->
                    <!--//添加字段-->
                    <!--title:'',-->
                    <!--stablepeoplecount:'',-->
                <!--},-->
                <!--ruleValidate: {-->

                <!--},-->

            <!--}-->
        <!--},-->
        <!--mounted: function () {},-->

        <!--methods: {-->
            <!--handleSubmit(name) {-->

                <!--let that = this;-->
                <!--let model = this.$refs[name].model;-->
                <!--this.$refs[name].validate((valid) => {-->
                    <!--that.addData(model);-->
                <!--})-->
            <!--},-->
            <!--//添加-->
            <!--addData: function (model) {-->
                <!--let that = this;-->

                <!--let params = that.$qs.stringify(model);-->
                <!--this.$Loading.start();-->

                <!--apiUtil.post(that, apiUtil.urls.AddTeam, params, function (res) {-->
                    <!--that.$Loading.finish();-->

                    <!--that.$Message.success('添加成功 ');-->

                <!--});-->
            <!--},-->

        <!--}-->
    <!--}-->
<!--</script>-->
<style type="text/css">
    .demo-upload-list {
        display: inline-block;
        width: 60px;
        height: 60px;
        text-align: center;
        line-height: 60px;
        border: 1px solid transparent;
        border-radius: 4px;
        overflow: hidden;
        background: #fff;
        position: relative;
        box-shadow: 0 1px 1px rgba(0, 0, 0, .2);
        margin-right: 4px;
    }

    .demo-upload-list img {
        width: 100%;
        height: 100%;
    }

    .demo-upload-list-cover {
        display: none;
        position: absolute;
        top: 0;
        bottom: 0;
        left: 0;
        right: 0;
        background: rgba(0, 0, 0, .6);
    }

    .demo-upload-list:hover .demo-upload-list-cover {
        display: block;
    }

    .demo-upload-list-cover i {
        color: #fff;
        font-size: 20px;
        cursor: pointer;
        margin: 0 2px;
    }

    .selected-search {
        box-shadow: 0 1px 6px rgba(0, 0, 0, .2);
        height: 200px;
        width: 260px;
        position: relative;
        border-radius: 4px;
    }

    .selected-search .search-action {
        position: absolute;
        top: 10px;
        left: 10px;
        right: 10px;
    }

    .selected-search .selected-arr {
        position: absolute;
        top: 50px;
        left: 20px;
        right: 20px;
        bottom: 10px;
        overflow: scroll;
    }

    .select-click {
        border: 1px solid #dddee1;
        border-radius: 4px;
        padding: 0 10px;
        margin-bottom: 10px;
    }

    .selected-search .selected-arr .selected-item {
        /*border-bottom: 1px solid #dfdfdf;*/
    }
</style>
<template>
    <i-form ref="formValidate" :model="formValidate" :rules="ruleValidate" :label-width="100">
        <Form-item label="编队名称" prop="teamTitle">
            <i-input v-model="formValidate.teamTitle" placeholder="请输入值班编队名称"></i-input>
        </Form-item>
        <!--<Form-item label="负责人" prop="personalName">-->
        <!--<p @click="getPeopelData()" class="select-click">{{personalName}}</p>-->
        <!--<div v-if="selectPeopelIsShow" class="selected-search">-->
        <!--<div class="search-action">-->
        <!--<i-input placeholder="查询人姓名"></i-input>-->
        <!--</div>-->
        <!--<div class="selected-arr">-->
        <!--<template v-for="(item,index) in principalArr">-->
        <!--<p @click="choosePeople(item.Id,item.Personalname)" class="selected-item">{{item.Personalname}}</p>-->
        <!--</template>-->
        <!--</div>-->
        <!--</div>-->
        <!--</Form-item>-->
        <Form-item label="标配人数" prop="limitMember">
            <i-input v-model="formValidate.limitMember" placeholder="请输入标配人数"></i-input>
        </Form-item>
        <!--<Form-item label="是否编队" prop="isteam">-->
            <!--<i-select v-model="formValidate.isteam" placeholder="请选择是否编队">-->
                <!--<i-option value="true">是</i-option>-->
                <!--<i-option value="false">否</i-option>-->
            <!--</i-select>-->
        <!--</Form-item>-->
        <Form-item>
            <i-button @click="handleSubmit('formValidate')" type="primary">提交</i-button>
            <i-button type="ghost" @click="jumpPage('','ZhibanTeamList')" style="margin-left: 8px">返回</i-button>
        </Form-item>
    </i-form>

</template>
<script>
    import apiUtil from '../../assets/utils/api_util';

    export default {
        data() {
            return {
                formValidate: {
                    //添加字段
                    teamTitle: '',
                    limitMember: '',
                    // isteam:true,
                },
                ruleValidate: {

                },
                image: '',
                principalId: '',
                principalArr: [],
                personalName: '请选择负责人',
                selectPeopelIsShow: false,
                //图片
                defaultList: [],
                imageList: '',
                imagePost: [],
                visible: false,
                seeImg: '',
                upLoadFile: apiUtil.urls.UploadFile,
                apiUtilBase: apiUtil.urls.baseUrl
            }
        },
        mounted: function () {
            // this.getPeopelData();
            this.uploadList();
        },

        methods: {
            //跳转
            jumpPage: function (id, url) {
                //跳转
                let route = '';
                if (id.length > 0) {
                    route = {
                        path: url,
                        query: {
                            id: id
                        },
                    };
                } else {
                    route = {
                        path: url,
                    };
                }

                this.$router.push(route);
            },
            changeOutDate: function (date) {
                console.log(date)
                this.formValidate.outdate = date;
            },
            handleSubmit(name) {

                let that = this;
                let model = this.$refs[name].model;
                this.$refs[name].validate((valid) => {
                    that.addData(model);
                })
            },
            //获取负责人
            getPeopelData() {
                let that = this;

                let para = {
                    curPage: 1,
                    pageSize: '',
                };

                this.$Loading.start();

                apiUtil.get(that, apiUtil.urls.userList, para, function (res) {
                    that.$Loading.finish();

                    that.selectPeopelIsShow = true;
                    that.principalArr = res.Msg.Arrays;
                });
            },
            choosePeople: function (id, name) {
                this.principalId = id;
                this.personalName = name;
                this.selectPeopelIsShow = false;

            },
            //添加
            addData: function (model) {
                let that = this;

                // model.faceimg = this.imagePost[0];
                // model.uplevelid = this.$route.query.id;

                // model.principalid = this.principalId;
                let params = that.$qs.stringify(model);
                this.$Loading.start();

                console.log('params:',params)
                apiUtil.post(that, apiUtil.urls.AddTeam, params, function (res) {
                    that.$Loading.finish();

                    that.$Notice.open({
                        title: '通知',
                        desc: '添加成功 ',
                        duration: 0
                    });

                });
            },

        }
    }
</script>
